<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://xmlns.jcp.org/jsf/core">
    <h:head>
        <title>Bienvenido al Gimnasio Inteligente</title>
        <link rel="stylesheet" href="resources/css/style.css" />
        <style type="text/css">
            html{
                height: 100%;
            }
            body{
                height: 80%;
            }
            .ui-layout-north {
                z-index:20 !important;
                overflow:visible !important;;
            }
            .ui-layout-north .ui-layout-unit-content {
                overflow:visible !important;
            }   
            .ui-layout-unit-content{
                overflow:visible !important;
            }
            .ui-autocomplete input { /*Amplia tamaño de campo de Texto Autocompletar*/
                width:300px;
            }
            .ui-calendar input{
                width:250px;
            }
        </style>
    </h:head>
    <h:body>
        <p:layout fullPage="true" >  

            <p:layoutUnit position="north" size="100" 
                          resizable="false" closable="false" collapsible="false" header="CONSULTA DE DEPORTISTAS CON
                          PERFILES SIMILARES">  
                <!--Encabezado o Menu Bar que es de Layout -->
                <p:menubar>   
                    <p:menuitem value="Inicio" url="inicio.xhtml" icon="inicio" />  
                    <p:submenu  label="Administracion de Deportistas" icon="administracion" >  
                        <p:menuitem value="Crear" url="crearDeportistas.xhtml" icon="usuario"/>  
                        <p:menuitem value="Asociar Rutinas" url="administrarPerfiles.xhtml" icon="permisos"/>
                        <p:menuitem value="Ajustar -re plan" url="administrarAreas.xhtml" icon="areas"/>
                    </p:submenu>  

                    <p:submenu label="Charlas - Foros - Eventos" icon="baseConocimiento" >  
                        <p:menuitem value="Crear nuevo Evento" url="creacionEventos.xhtml" icon ="categorias"/>   
                        <p:menuitem value="Programación Eventos" url="programacionEventos.xhtml" icon ="solucion"/>   
                    </p:submenu>  

                    <p:submenu label="Reportes" icon="incidencia">
                        <p:menuitem value="Historial de Usuariio" url="IncidenciasxResolver.xhtml" icon="mio"/> 
                        <p:menuitem value="Perfiles Similares" url="perfilesSimilares.xhtml" icon="problema" />
                        <p:menuitem value="Bajos Desempeños" url="administrarAsignaciones.xhtml" icon="solucion"/> 
                        <p:menuitem value="Pagos realizados" url="administrarAsignaciones.xhtml" icon="asociar"/> 
                    </p:submenu> 
                    <p:submenu label="Máquinas de Ejercicios"  icon="candado" >  
                        <p:menuitem value="Asoc Máquina-Usuario" url="asociarMaquinaUsuario.xhtml" icon="mio"/> 
                    </p:submenu> 
                </p:menubar>

            </p:layoutUnit> 
            <!--*************************************************************************** -->           
            <!-- Panel central o Contenedor  -->

            <p:layoutUnit position="center" size="1200" 
                          style="border-bottom: transparent; 
                          border-top: transparent; 
                          border-left: transparent; 
                          border-right: transparent"> 
                <h:form id="frmCrearEvento">
                    <h:panelGrid columns="2" width="1400"> 
                        <h:panelGrid columns="2" border="1" style="margin-left: 70px;" cellspacing="6"> 
                            <p:outputLabel value="Selecciona el parámetro de Búsqueda"></p:outputLabel>
                            <p:outputLabel value="Comparativo de Reporte:"></p:outputLabel>
                            <p:selectOneMenu value="#{perfilesSimilaresBean.busquedaPor}" required="true" requiredMessage="Debes seleccionar uno parámetro">
                                <f:selectItem itemLabel="Selecciona un parámetro de Búsqueda" itemValue="" />  
                                <f:selectItem itemLabel="Peso" itemValue="Peso" />  
                                <f:selectItem itemLabel="Edad" itemValue="Edad" />  
                                <f:selectItem itemLabel="Genero" itemValue="Genero" />  
                            </p:selectOneMenu>
                            <p:selectOneMenu value="#{perfilesSimilaresBean.criterioBusqueda}" required="true" requiredMessage="Debes seleccionar uno parámetro">
                                <f:selectItem itemLabel="Selecciona un criterio" itemValue="" />  
                                <f:selectItem itemLabel="Igual a" itemValue="1" />  
                                <f:selectItem itemLabel="Mayor o igual a" itemValue="2" />  
                                <f:selectItem itemLabel="Menor o igual a" itemValue="3" />  
                            </p:selectOneMenu>
                            Si es por género: 1 Femenino / 2 Masculino
                            <p:inputText size="20" required="true" value="#{perfilesSimilaresBean.valorBusqueda}"
                                         converter="#{Integer}" requiredMessage="Valor Requerido" >
                            </p:inputText>
                            <table align="center">
                                <tr>
                                    <td align="center">
                                        <h:commandButton value="Generar Reporte" 
                                                         action="#{perfilesSimilaresBean.submit()}" />
                                    </td>
                                </tr>
                            </table>
                        </h:panelGrid>
                        <h:panelGrid columns="1" > 
                            <img src="resources/img/perfilesSimilares.jpg" width="400px">
                            </img>
                        </h:panelGrid>
                    </h:panelGrid>
                    <br />
                    <p:dataTable value="#{perfilesSimilaresBean.usuariosReporte}" var="x" 
                                 widgetVar="tablaUsuarios" 
                                 paginatorPosition="bottom" paginator="true" rows="5"
                                 paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"  
                                 rowsPerPageTemplate="5,10,15" style="font-size: 13px"
                                 emptyMessage="No existen Perfiles Similiares a los parámetros dados.">
                        <p:column headerText="Identificación">
                            <h:outputText value="#{x.idUsuario}" />  
                        </p:column>
                        <p:column headerText="Nombres">
                            <h:outputText value="#{x.nombres}" />  
                        </p:column>
                        <p:column headerText="Apellidos">
                            <h:outputText value="#{x.apellidos}" />  
                        </p:column>
                        <p:column headerText="Fecha Nacimiento" >
                            <h:outputText value="#{x.fechaNacimiento}" />  
                        </p:column>
                        <p:column headerText="Genero">
                            <h:outputText value="#{x.genero}" />  
                        </p:column>
                    </p:dataTable>
                </h:form>
            </p:layoutUnit>
            <p:layoutUnit position="south" size="70" header="" resizable="false" closable="false" collapsible="false" 
                          style="text-align:center; font-size: 12px;" >  
                <h:outputText value="Gimnasio Inteligentes" /> <br /> 
                <h:outputText value="Corporaci&oacute;n universitaria Minuto de Dios" />  <br />
                <h:outputText value="Desarrollado por: Yinna Martinez y Diego Babativa" /><br />
            </p:layoutUnit> 
        </p:layout>
    </h:body>
</html>